<template>
	<view class="content content1">
		<u-form :model="form" ref="uForm" label-position="left" label-width="76">
			<u-form-item :border-bottom="false" label="信息名称:" prop="name">
				<u-input v-model="form.name" />
			</u-form-item>

			<u-form-item :border-bottom="false" label="所在地区:" prop="area">
				<view style="position: relative;">
					<u-input disabledColor="#ffffff" :disabled="true" v-model="form.area" suffixIcon="map-fill"
						suffixIconStyle="color: #909399" />
					<view @click="openAdr()"
						style="z-index: 2; position: absolute; left: 2%; top: 0rpx; width: 96%; height: 100%;">
					</view>
				</view>
			</u-form-item>

			<u-form-item :border-bottom="false" label="教练姓名:" prop="teacher_name">
				<u-input v-model="form.teacher_name" />
			</u-form-item>
			<u-form-item :border-bottom="false" label="教练电话:" prop="teacher_phone">
				<u-input v-model="form.teacher_phone" />
			</u-form-item>
			<u-form-item :border-bottom="false" label="教练照片:" prop="teacher_photo">
				<u-upload :fileList="fileList1" @afterRead="afterReadPic" @delete="deletePic" name="1"
					:maxCount="1"></u-upload>
			</u-form-item>
			<u-form-item :border-bottom="false" label="教练实力:" prop="teacher_desc">
				<view class="flex-row-start">
					<u-input style="width: 200rpx;" v-model="form.teacher_desc" type="number" />
					<div style="width: 150rpx; font-size: 14px; text-align: center;">积分</div>
				</view>
			</u-form-item>
			<u-form-item :border-bottom="false" label="教练打法:" prop="teacher_desc">
				<u-radio-group v-model="form.teacher_type" placement="row">
					<u-radio :customStyle="{marginRight: '60rpx'}" v-for="(item, index) in userWayList" :key="index"
						:label="item.name" :name="item.id">
					</u-radio>
				</u-radio-group>


			</u-form-item>
			<u-form-item :border-bottom="false" label="胶皮属性:" prop="jiaopi_type">
				<u-input v-model="form.jiaopi_type" />
			</u-form-item>
			<u-form-item :border-bottom="false" label="教练案例视频:" prop="video_url" label-width="102">
				<u-upload :fileList="fileList2" @afterRead="afterReadPic" @delete="deletePic" name="2" accept="video"
					:maxCount="1"></u-upload>
			</u-form-item>

			<u-form-item :border-bottom="false" label="收费规则:" prop="shoufei_type">
				<view class="flex-row-start">
					<u-radio-group v-model="form.shoufei_type" placement="row" style="flex: none;">
						<u-radio :customStyle="{marginRight: '40rpx'}" v-for="(item, index) in feeWayList" :key="index"
							:label="item.name" :name="item.id">
						</u-radio>
					</u-radio-group>

					<view style="margin-left: -40rpx; width: 150rpx; height: 40rpx;" class="flex-row-start"
						v-if="form.shoufei_type == 2">
						<u-input fontSize="24rpx" type="digit"
							:customStyle="{paddingTop:'0px',paddingBottom:'0px',paddingRight:'4rpx',paddingLeft:'4rpx'}"
							v-model="form.every_hour"></u-input>元/小时
					</view>
				</view>

			</u-form-item>
			<view style="height: 60rpx;"></view>

			<u-form-item :border-bottom="false">
				<view class="flex-row-center">
					<view style="width: 200rpx; margin-right: 20rpx;">
						<u-button>取消重填</u-button>
					</view>
					<view style="width: 200rpx;">
						<u-button :loading="sureLoading" type="primary" @click="sureBtnClick()">确定发布</u-button>
					</view>
				</view>
			</u-form-item>
		</u-form>
		<view class="distanceH1"></view>

		<cc-selectDity :show="showAdr" @changeClick="changeClick" :province="adrModel.province" :city="adrModel.city"
			:area="adrModel.area" @sureSelectArea="getAddress" @hideShow="showAdr = false"></cc-selectDity>



	</view>
</template>

<script>
	import urlConfig from '@/api/config.js'
	import {
		personalPublish,
		createOrder,
		payOrder
	} from '@/api/api'

	export default {
		data() {
			return {
				sureLoading: false,
				showAdr: false,
				form: {
					name: '',
					area: '',
					teacher_name: '',
					teacher_photo: '',
					teacher_desc: '', //教练实力
					teacher_phone: '',
					teacher_type: '', //教练打发(横拍、直拍)
					video_url: '', //视频案例
					shoufei_type: undefined,
					every_hour: undefined
				},
				rules: {
					'name': {
						type: 'string',
						required: true,
						message: '请输入信息名称',
						trigger: ['blur', 'change']
					},
					'area': {
						type: 'string',
						required: true,
						message: '请选择所在地区',
						trigger: ['blur', 'change']
					},
					'teacher_name': {
						type: 'string',
						required: true,
						message: '请输入教练姓名',
						trigger: ['blur', 'change']
					},
					'teacher_phone': {
						type: 'string',
						required: true,
						message: '请输入教练电话',
						trigger: ['blur', 'change']
					},
					"shoufei_type": {
						type: 'number',
						required: true,
						message: '请选择收费规则',
						trigger: ['change']
					},
					"shoufei_type": {
						type: 'number',
						required: true,
						message: '请选择收费规则',
						trigger: ['change']
					}
				},
				fileList1: [],
				fileList2: [],
				userWayList: [{
					id: 1,
					name: '直拍'
				}, {
					id: 2,
					name: '横拍'
				}],
				feeWayList: [{
					id: 1,
					name: '电话面议'
				}, {
					id: 2,
					name: '按小时收费'
				}],
				adrModel: {
					province: "北京",
					city: "北京市",
					area: "东城区",
					areaCode: ''

				}

			}
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.uForm.setRules(this.rules)
		},
		methods: {
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterReadPic(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url, event.name)
					var result1 = JSON.parse(result)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: result1.code == 200 ? 'success' : 'fail',
						message: '',
						url: item.type == 'image' ? result1.data.imgUrl : result1.data.pathUrl
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url, eventName) {
				if (eventName == 2) {
					var VIDEO_REGEXP = /\.(mp4|mpg|mpeg|dat|asf|avi|rm|rmvb|mov|wmv|flv|mkv|m3u8)/i
					if (!VIDEO_REGEXP.test(url)) {
						eventName = 1
					}
				}
				return new Promise((resolve, reject) => {
					var url1 = eventName == 1 ? urlConfig + '/system/uploadImg' : urlConfig + '/system/uploadVideo'
					let a = uni.uploadFile({
						url: url1, // 仅为示例，非真实的接口地址
						filePath: url,
						name: eventName == 1 ? 'uploadImg' : 'uploadFile',
						formData: {
							user: 'test'
						},
						success: (res) => {
							setTimeout(() => {
								resolve(res.data)
							}, 1000)
						}
					});
				})
			},
			openAdr() {
				this.showAdr = true
			},
			// 获取地址
			getAddress(e) {
				var data = e.detail.target.dataset;
				var address = data.province + '-' + data.city + '-' + data.area;
				this.showAdr = false
				this.form.area = address
			},
			changeClick(value, value2, value3, value4) {
				this.adrModel.province = value;
				this.adrModel.city = value2;
				this.adrModel.area = value3;
				this.adrModel.areaCode = value4;
			},
			requestPayOrder(){
				this.sureLoading = true
				uni.showLoading({
					mask:true
				})
				console.log('支付失败113')
				createOrder({person_id:this._publishId}).then(res=>{
					if(res.data.code == 200){
						this._orderId = res.data.data.id
						this.requestPayOrder2()
						
					}
					uni.hideLoading()
					uni.$u.toast(res.data.message)
				}).catch(err=>{
					this.sureLoading = false
					uni.hideLoading()
				})
				
			},
			requestPayOrder2(){
				payOrder({order_id:this._orderId}).then(res1=>{
					if (res1.data.code == 200){
						var data = res1.data.data
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: data.timeStamp, //时间戳从1970年1月1日至今的秒数，即当前的时间。
							nonceStr: data.nonceStr, //随机字符串，长度为32个字符以下。//统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=xx
							package: data.package,
							signType: data.signType, //签名算法，应与后台下单时的值一致
							paySign: data.paySign, //签名
							success: (res2) => {
								uni.hideLoading()
								uni.navigateBack()
								uni.$u.toast('支付成功')
								
							
								
							},
							fail: (err) => {
								console.log('支付失败',err)
								uni.hideLoading();
							},
							
						})
						
						return
					}
					uni.hideLoading()
					
					uni.$u.toast(res1.data.message)
				})
				
				
			},
			sureBtnClick() {
				if (this._publishId){
					uni.showModal({
						content: '发布本类信息需一次性支付信息服务费\n50元/条',
						cancelText: '取消发布',
						confirmText: '我要支付',
						success: res => {
							if (res.confirm) {
								this.requestPayOrder()
					
							} else {
								uni.navigateBack()
							}
						}
					})
					return
				}

				this.$refs.uForm.validate().then(res => {
					if (this.form.shoufei_type == 2 && !this.form.every_hour) {
						uni.$u.toast('请输入每小时价格')
						return
					}
					this.sureLoading = true
					uni.showLoading({
						mask: true
					})
					var param = {
						...this.form
					}
					if (this.fileList1 && this.fileList1.length > 0) {
						param.teacher_photo = this.fileList1[0].url
					}
					if (this.fileList2 && this.fileList2.length > 0) {
						param.video_url = this.fileList2[0].url
					}
					param.type = 1

					personalPublish(param).then(res1 => {
						this.sureLoading = false
						uni.hideLoading()
						if (res1.data.code == 200) {
							this._publishId = res1.data.data.info.id
							uni.showModal({
								content: '发布本类信息需一次性支付信息服务费\n50元/条',
								cancelText: '取消发布',
								confirmText: '我要支付',
								success: res2 => {
									if (res2.confirm) {
										this.requestPayOrder()

									} else {
										uni.navigateBack()
									}
								}
							})

							return
						}
						uni.$u.toast(res1.data.message)

					})
				}).catch(errors => {
					this.sureLoading = false
					uni.hideLoading()

				})

			}

		}
	}
</script>

<style lang="scss" scoped>
	.content1 {
		padding: 10rpx 30rpx;
		font-size: 15px;

	}
</style>